<template>
	<view>
		<view class="page-foot flex-box">
			<button class="m-button flex-box flex-1 flex-center">
				<image class="icon mr15" src="/static/icon/icon_share6.png" mode="aspectFit"></image>
				<view class="fs26 col-3">分享</view>
			</button>
			<button class="m-button flex-box flex-1 flex-center">
				<image class="icon mr15" src="/static/icon/icon_comment2.png" mode="aspectFit"></image>
				<view class="fs26 col-3">聊天</view>
			</button>
		</view>
		<view class="container tc">
			<image class="icon_service" src="/static/icon/img_service.png" mode="aspectFill"></image>
			<view class="mb50 fs34 fwb col-3">官方客服:{{costume.name}}</view>
			<view class="flex-box flex-center">
				<view class="mr40 fs28 col-3">专属客服电话：{{costume.mobile}}</view>
				<button class="btn-call m-button flex-box" @click="phoneCall()">
					<image class="icon-call mr20" src="/static/icon/icon_call.png" mode="aspectFit"></image>
					<view class="fs32 col-red">拨打</view>
				</button>
			</view>
			<image class="icon_qrcode" :src="qrcode" mode="aspectFill" show-menu-by-longpress="true"></image>
			<view class="fs30 col-3 ">扫一扫添加客服</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			costume:{},
			qrcode:''
			
		};
	},
	onLoad(){
		this.fetchConfig();
	},
	methods: {
		fetchConfig(){
			this.$core.get({url:'xiluedu.config/config',data:{name:'mobileconfig'},success:(ret)=>{
				 let costume = ret.data.customers ? JSON.parse(ret.data.customers) :[];
				 this.costume = costume[0]
				 console.log(this.costume[0]);
				 this.qrcode = ret.data.custom_qrcode
			}});
		},
		phoneCall(){
			let phone = this.costume.mobile || '';
			if(phone == '') return false;
			uni.makePhoneCall({
				phoneNumber: phone //仅为示例
			});
		}
	}
};
</script>

<style scoped>
.container {
	padding-top: 70rpx;
}
.icon_service {
	margin: 0 auto 30rpx;
	display: block;
	width: 200rpx;
	height: 208rpx;
}
.btn-call {
	height: 42rpx;
}
.btn-call .icon-call {
	display: block;
	width: 42rpx;
	height: 42rpx;
}
.icon_qrcode {
	margin: 90rpx auto 45rpx;
	display: block;
	width: 391rpx;
	height: 391rpx;
	border: 1rpx solid #c9c9c9;
}
/*  */
.page-foot {
	height: 100rpx;
	background-color: #fff;
	border-top: 1rpx solid #EFEFEF;
}
.page-foot .icon{
	display: block;
	width: 34rpx;
	height: 34rpx;
}
.page-foot .m-button{
	height: 100rpx;
	background-color: #fff;
}
.page-foot .m-button::after{
	display: none;
}
</style>
